import React, {Component} from "react";
import {InputItem, List, NavBar, Button, WingBlank, Radio, WhiteSpace} from "antd-mobile";

import Logo from "../../components/logo"

const {Item} = List

class Register extends Component {

    state = {
        username: '',
        password: '',
        type: '',
        rePassword: ''
    }
    changeFormItem = (name, value) => {
        this.setState({name: value})
    }
    handleRegister = () => {

    }
    goToLogin = () => {
        this.props.history.replace('/login')
    }

    render() {
        return (<div>
            <NavBar>硅谷招聘</NavBar>
            <Logo/>
            <WingBlank>
                <List>
                    <InputItem onChange={val => this.changeFormItem('username', val)}>用户名：</InputItem>
                    <WhiteSpace/>
                    <InputItem onChange={val => this.changeFormItem('password', val)}>密码：</InputItem>
                    <InputItem onChange={val => this.changeFormItem('rePassword', val)}>确认密码：</InputItem>
                    <WhiteSpace/>
                    <Item>
                        用户类型：
                        <Radio name='type' wrapLabel='one'>大神</Radio>&nbsp;&nbsp;&nbsp;&nbsp;
                        <Radio name='type'>老板</Radio>
                    </Item>
                    <WhiteSpace/>
                    <Button type='primary' onClick={this.handleRegister}>注册</Button>
                    <WhiteSpace/>
                    <Button onClick={this.goToLogin}>已有账号</Button>
                </List>
            </WingBlank>
        </div>)
    }
}

export default Register